<!DOCTYPE html>
<html>
<head>
	{{template "header"}}
</head>
<body>
	{{template "navbar-image"}}
	{{template "navbar" .}}

	<div class="container">
		<h1>分类列表</h1>
		<form method="GET" action="/fenlei">
			<div class="form-group">
				<label>分类名称</label>
				<input id="uname" class="form-control" placeholder="Enter account" name="uname">
			</div>
			
			<div class="form-group">
				<a href="https://v3.bootcss.com/components/">分类图标</a>
				<input id="tubiao" class="form-control" placeholder="boostrap 图标" name="tubiao">
			</div>
			<input type="hidden" name="op"  value="add">
			<button type="submit" class="btn btn-default" onclick="return checkInput()">添加</button>
		</form>

		<table class="table table-striped">
			<thead>
				<tr>
					<th>#</th>
					<th>图标</th>
					<th>名称</th>
					<th>文章数</th>
					<th>操作</th>
				</tr>
			</thead>
			<tbody>
				{{range .fenlei}}
					<tr>
						<th>{{.Id}}</th>
						<th> 
						<span class= {{.TuBiao}}></span>
						</th>
						<th> {{.Title}} </th>
						<th> {{.TopicCount}} </th>
						<th>
							{{if .IsAddnav}}
							<a href="/fenlei?op=delnav&id={{.Id}}">删除</a>
						{{else}}
							<a href="/fenlei?op=addnav&id={{.Id}}">添加</a>
						{{end}}
						</th>
						
					</tr>
					
				{{end}}
			</tbody>
		</table>
	</div>



	<script type="text/javascript">
		function checkInput() {
			var uname = document.getElementById("uname");

			if(uname.value.length == 0) {
				alert("请输入分类名称！");
				return false;
			}
		}
	</script>
</body>
</html>